<template>
	<view>
		<Header :showBack="true"></Header>
		
		<view class="container">
			<view class="info">
				<view class="ava">
				</view>
				<view>
					<view>姓&#12288;名：{{info.ownerName||'无'}}</view>
					<view><view>学&#12288;校：</view><view>{{info.organizationName||'无'}}</view></view>
					<view>班&#12288;级：{{info.gradeName||'无'}}</view>
					<!-- <view>状&#12288;态：{{info.isSign?'已签约代扣':(info.isGather?'已采集未签约':'未采集')}}</view> -->
				</view>
			</view>
			
			<view class="todayData">
				<view>
					今日交易
				</view>
				<view>
					<view>
						<view>班级人数</view>
						<view>{{allInfo.totalCount}}</view>
					</view>
					<view>
						<view>交易人数</view>
						<view>{{todayList.length}}</view>
					</view>
					<view>
						<view>交易金额</view>
						<view>{{todayData.amount}}</view>
					</view>
					<view>
						<view>交易笔数</view>
						<view>{{todayData.count}}</view>
					</view>
					<view>
						<view>单笔金额</view>
						<view>{{todayData.count>0?(todayData.amount/todayData.count).toFixed(2):0}}</view>
					</view>
					<view>
						<view>人均笔数</view>
						<view>{{todayList.length>0?(todayData.count/todayList.length).toFixed(2):0}}</view>
					</view>
				</view>
			</view>
			
			<view v-for="(item,index) in list" class="box" :key="index">
				<view @click="toPath(it.path)" v-for="(it,idx) in item" :key="idx">
					<image :src="it.imgUrl" mode=""></image>
					<view>{{it.type}}</view>
				</view>
			</view>
		</view>
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info:uni.getStorageSync('info'),
				todayData:{},
				allInfo:{},
				todayList:[],
				list:[
					[
						{
							imgUrl:'../../static/class1.png',
							type:'用户信息',
							path:'/pages/banzhuren/banzhuren'
						},
						{
							imgUrl:'../../static/img/liushui.png',
							type:'消费记录',
							path:'/pages/banzhuren/classSale'
						},
						{
							imgUrl:'../../static/img/qiehuan.png',
							type:'切换用户',
							path:'/pages/changeCard/changeCard'
						}
					]
				]
			}
		},
		onLoad() {
			this.getData()
		},
		methods: {
			toPath(url){
				uni.navigateTo({
					url:url
				})
			},
			getData(){
				let date = new Date().toISOString().split('T')[0];
				this.$http('/member/api/memberCard/statisticsClassOrderList',{
					condition:{
						trTimeStart:date,
						trTimeEnd:date,
						memberCardId:this.info.id
					},
					pageNum: 1,
					pageSize: 15
				},res=>{
					this.todayData = res.data.summary
					this.todayList = res.data.items
				})
				
				this.$http('/member/api/memberCard/StatisticsTeacherMemberCard',{
					condition:{
						memberCardId:this.info.id,
					}
				},res=>{
					this.allInfo = res.data
				})
				
			}
		}
	}
</script>

<style scoped lang="less">
.info{
		width: 100%;
		display: flex;
		padding-top: 20upx;
		position: relative;
		.ava{
			width: 30upx;
			height: 150upx;
			border-radius: 10%;
			overflow: hidden;
			margin: 0 50upx;
			position: relative;
			top: 16upx;
			// width: 150upx;
			// height: 150upx;
			// border-radius: 10%;
			// overflow: hidden;
			// margin:0 50upx;
			// position: relative;
			// top: 0upx;
		}
		>view:nth-child(2){
			font-size: 30upx;
			>view{
				margin-bottom: 6upx;
				display: flex;
				>view:first-child{
					white-space: nowrap;
				}
				>view:last-child{
					
				}
			}
		}
	}
	.bg{
		width: 100%;
		background-image: url(../../static/img/bg.png);
		height: 100upx;
		background-size: 100% 100%;
	}
.todayData{
	box-sizing: border-box;
	background-color: #FFFFFF;
	box-shadow: 0 3upx 20upx 1upx rgba(247, 200, 122, .2);
	border-radius: 16upx;
	margin: 25upx auto 0;
		padding: 20upx 0 0;
		>view:first-child{
			width: 100%;
			text-indent: 30upx;
			font-size: 28upx;
		}
		>view:last-child{
			display: grid;
			grid-template-columns: repeat(3,1fr);
			margin-top: 30upx;
			>view{
				text-align: center;
				>view:first-child{
					font-size: 24upx;
					color: #999999;
				}
				>view:last-child{
					font-size: 32upx;
					font-weight: 600;
					margin-top: 25upx;
					margin-bottom: 40upx;
				}
			}
		}
	}
	.box{
		margin: 38upx auto 0;
		background-color: #FFFFFF;
		display: flex;
		justify-content: space-between;
		padding: 30upx 0;
		border-radius: 8upx;
		box-shadow: 0 3upx 20upx 1upx rgba(247, 200, 122, .2);
		>view{
			width: 33.3%;
			text-align: center;
			font-size: 28upx;
			>image{
				width: 60upx;
				height: 60upx;
			}
			>view{
				font-size: 26upx;
				margin-top: 10upx;
				height: 40upx;
				line-height: 40upx;
			}
		}
	}
</style>
